<template>
    <div>
        <div class="navbar-div">
            <van-nav-bar title="评论详情" left-arrow @click-left="onClickLeft" />
        </div>
        <div class="comment-info">
            <div class="comment-title">
                <img class="avatar" :src="item.avatar" width="100%">
                <span class="nickname">{{item.username | stringFilter(12)}}</span>
                <span class="time">{{item.ctime | timeFilter}}</span>
            </div>
            <p class="comment-content">{{item.content}}</p>
        </div>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                cid: '', // 该顶级评论的索引
            }
        },
        created() {
            let cid = this.$route.params.cid || this.$route.query.cid;
            console.log(cid);
            this.getTopCommentDetail(cid);
        },
        methods: {
            onClickLeft() {
                this.$router.go(-1);
            },
            // 获取顶级评论的详情
            getTopCommentDetail() {
                
            }
        }
    }
</script>

<style scoped lang="scss">
// 顶级评论列表
.comment-info {
    font-size: .8rem;
    .comment-title {
        display: flex;
        align-items: center;
        .avatar {
            width: 1.6rem;
            height: 1.6rem;
            border-radius: .8rem;
            overflow: hidden;
            margin-right: .5rem;
        }
        .nickname {
            flex: 1;
            color: #ff4f5e;
        }
        .time {
            color: grey;
            margin-left: auto;
        }
    }
}
</style>